# Tag

Tag - это компактные элементы, представляющие входные данные, атрибут или действие.
В зависимости от назначения, они делятся на 3 типа, каждый из которых обладает собственными атрибутами.

## API

#### Общие свойства

| Свойство  | Тип        | Описание                         |
| --------- | ---------- | -------------------------------- |
| `classes` | `Classes`  | `JSS-классы для стилизации`      |
| `variant` | `TTagType` | `Тип тега, по умолчанию PRIMARY` |

#### PRIMARY

| Свойство   | Тип        | Описание                                                                                   |
| ---------- | ---------- | ------------------------------------------------------------------------------------------ |
| `onDelete` | `function` | `Обработчик, вызываемый при удалении тега`                                                 |
| `onClick`  | `function` | `Обработчик, вызываемый при нажатии на тег`                                                |
| `dragged`  | `boolean`  | `Свойство, определяющее состояния тега во время его перемещения. Реализован только класс.` |

#### SELECTABLE

| Свойство   | Тип        | Описание                                                |
| ---------- | ---------- | ------------------------------------------------------- |
| `onDelete` | `function` | `Обработчик, вызываемый при удалении тега`              |
| `onClick`  | `function` | `Обработчик, вызываемый при нажатии на тег`             |
| `selected` | `boolean`  | `Свойство, определяющее состояние тега: выбран или нет` |

#### MULTICOLOR

| Свойство | Тип                 | Описание                           |
| -------- | ------------------- | ---------------------------------- |
| `fill`   | `TagColor` `string` | `Свойство, определяющее цвет тега` |

## Пример использования

```javascript
import { Tag } from '@v-uik/tag'
;<Tag variant="primary" onClick={onClick}>
  //Your content
</Tag>
```

# TagInput

TagInput — элемент для добавления новых тегов

## API

| Свойство      | Тип                | Описание                                      |
| ------------- | ------------------ | --------------------------------------------- |
| `classes`     | `Classes`          | `JSS-классы для стилизации`                   |
| `label`       | `string`           | `Текст кнопки`                                |
| `width`       | `number ⎮ string`  | `Ширина элемента`                             |
| `disabled`    | `boolean`          | `Поле заблокировано для ввода`                |
| `placeholder` | `string`           | `Подсказка внутри поля, если не введен текст` |
| `value`       | `ReactText ⎮ null` | `Значение поля`                               |
| `onChange`    | `function`         | `Обработчик события изменения значения поля`  |
| `onSubmit`    | `function`         | `Обработчик события отправки значения`        |

## Пример использования

```javascript
import { TagInput } from '@v-uik/tag'
;<TagInput label="New tag" placeholder="New tag" onSubmit={onSubmit} />
```
